<div id="main-content">
  <div class="container-fluid">
    <ul class="breadcrumb">
    <li><a href="<?=  site_url("outlet/aktifitas/detail/".$this->uri->segment(4)) ?>">Back To FS OUTLET <?php echo $name_outlet; ?></a></li> 
     <li style="margin-left: 60%;"><a href="<?=  site_url("outlet/aktifitas/pica/".$id_actifity_report_new) ?>"><i class="icon-plus"></i> History</a></li>
<!--    <li><a href="<?=  site_url("outlet/aktifitas/history/".$id_actifity_report_new) ?>"><i class="icon-plus"></i> PICA</a></li>-->
     <li><a href="<?=  site_url("outlet/aktifitas/half-export-xls/".$id_actifity_report_new) ?>"><i class="black-icons excel_document"></i>XLS (1-15)</a></li>
     <li><a href="<?=  site_url("outlet/aktifitas/fs-export-xls/".$id_actifity_report_new) ?>"><i class="black-icons excel_document"></i> Export to XLS</a></li>
		</ul>
    <div class="widget-selectbox">
      <ul>
        <li>
          <form action="#" method="get">
            <div class="input-prepend"> <span class="add-on"><i class="icon-list-alt"></i></span>
              <?php print $this->form_eksternal->form_dropdown('activity_report', $list, array($id_actifity_report_new), 'id="activity_report"')?>
            </div>
          </form>
        </li>
      </ul>
    </div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL UNIT SERVICE</h5>
        <div class="graph-wrap">
          <div id="total_service_title" class="chart-block">
            <div id="chart_total_service">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL UNIT BELANJA</h5>
        <div class="graph-wrap">
          <div id="total_belanja_title" class="chart-block">
            <div id="chart_total_belanja">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL UNIT TRANSAKSI</h5>
        <div class="graph-wrap">
          <div id="total_transaksi_title" class="chart-block">
            <div id="chart_total_transaksi">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL RUPIAH SERVICE</h5>
        <div class="graph-wrap">
          <div id="total_rupiah_service_title" class="chart-block">
            <div id="chart_total_rupiah_service">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL RUPIAH BELANJA</h5>
        <div class="graph-wrap">
          <div id="total_rupiah_belanja_title" class="chart-block">
            <div id="chart_total_rupiah_belanja">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>TOTAL RUPIAH TRANSAKSI</h5>
        <div class="graph-wrap">
          <div id="total_rupiah_transaksi_title" class="chart-block">
            <div id="chart_total_rupiah_transaksi">
            </div>
          </div>
        </div>
			</div>
		</div>
    <div class="row-fluid">
			<div class="span12">
        <h5>COSTUME</h5>
        <div class="graph-wrap">
          <div id="costume_title" class="chart-block">
            <div id="costume">
            </div>
          </div>
        </div>
			</div>
		</div>
  </div>
</div>
<script>
  $(document).ready(function(){
    $("#activity_report").change(function(){
      window.location = "<?php print site_url("outlet/aktifitas/unit-entry-chart")?>/" + $("#activity_report").val();
//      alert($("#tahun_select").val());
    });
  });
$(function () {
//    ------------------------------------------------------------------------------------------------
<?php
$total_service = "";
$no = 0;
$val_service = 0;
$val_belanja = 0;
$val_transaksi = 0;
$val_rupiah_service = 0;
$val_rupiah_belanja = 0;
$val_rupiah_transaksi = 0;
foreach ($res as $key => $value) {
  $val_service += $value->total_service;
  $val_belanja += $value->total_belanja;
  $val_transaksi += $value->total_transaksi;
  $val_rupiah_service += $value->rupiah_service;
  $val_rupiah_belanja += $value->rupiah_belanja;
  $val_rupiah_transaksi += $value->rupiah_transaksi;
  
  if($no == 0)
    $first_total_service = $key;
  
  $total_service .= <<<EOD
    ['{$key}', {$val_service}],
EOD;
  $total_service_target .= <<<EOD
    ['{$key}', {$value->target_service}],
EOD;
  
  $total_belanja .= <<<EOD
    ['{$key}', {$val_belanja}],
EOD;
  $total_belanja_target .= <<<EOD
    ['{$key}', {$value->target_belanja}],
EOD;
  
  $total_transaksi .= <<<EOD
    ['{$key}', {$val_transaksi}],
EOD;
  $total_transaksi_target .= <<<EOD
    ['{$key}', {$value->target_transaksi}],
EOD;
  
  $total_rupiah_service .= <<<EOD
    ['{$key}', {$val_rupiah_service}],
EOD;
  $total_rupiah_service_target .= <<<EOD
    ['{$key}', {$value->target_rupiah_service}],
EOD;
    
  $total_rupiah_belanja .= <<<EOD
    ['{$key}', {$val_rupiah_belanja}],
EOD;
  $total_rupiah_belanja_target .= <<<EOD
    ['{$key}', {$value->target_rupiah_belanja}],
EOD;
    
  $total_rupiah_transaksi .= <<<EOD
    ['{$key}', {$val_rupiah_transaksi}],
EOD;
  $total_rupiah_transaksi_target .= <<<EOD
    ['{$key}', {$value->target_rupiah_transaksi}],
EOD;
    
    $no++;
}
//print $total_rupiah_transaksi;die;

?>
    
    var total_service = [
      <?=$total_service?>
    ];
    var target_total_service = [
      <?=$total_service_target?>
    ];
    
    var total_belanja = [
      <?=$total_belanja?>
    ];
    var target_total_belanja = [
      <?=$total_belanja_target?>
    ];
    
    var total_transaksi = [
      <?=$total_transaksi?>
    ];
    var target_total_transaksi = [
      <?=$total_transaksi_target?>
    ];
    
    var total_rupiah_service = [
      <?=$total_rupiah_service?>
    ];
    var target_total_rupiah_service = [
      <?=$total_rupiah_service_target?>
    ];
    
    var total_rupiah_belanja = [
      <?=$total_rupiah_belanja?>
    ];
    var target_total_rupiah_belanja = [
      <?=$total_rupiah_belanja_target?>
    ];
    
    var total_rupiah_transaksi = [
      <?=$total_rupiah_transaksi?>
    ];
    var target_total_rupiah_transaksi = [
      <?=$total_rupiah_transaksi_target?>
    ];
    
    var plot1 = $.jqplot("chart_total_service", [total_service, target_total_service], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Unit Service',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00', 
            //seriesColors: ["#cc0000", "#ff8a00"],// color of marker, set to color of line by default.
           // colors: ["#cc0000", "#ff8a00"],
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Unit Service',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                 markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot2 = $.jqplot("chart_total_belanja", [total_belanja, target_total_belanja], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Unit Belanja',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Unit Belanja',
                 markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot3 = $.jqplot("chart_total_transaksi", [total_transaksi, target_total_transaksi], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Unit Tansaksi',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
          //  color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Unit Transaksi',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot4 = $.jqplot("chart_total_rupiah_service", [total_rupiah_service, target_total_rupiah_service], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Rupiah Service',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Rupiah Service',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot5 = $.jqplot("chart_total_rupiah_belanja", [total_rupiah_belanja, target_total_rupiah_belanja], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Rupiah Belanja',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Rupiah Belanja',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot6 = $.jqplot("chart_total_rupiah_transaksi", [total_rupiah_transaksi, target_total_rupiah_transaksi], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Rupiah Transaksi',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Rupiah Transaksi',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    var plot7 = $.jqplot("costume", [<?php print $costume1?>, <?php print $costume2?>], {
        seriesColors: ["#d9e2f7", "#cc0000"],
        title: 'Total Rupiah Transaksi',
        highlighter: {
            show: true,
            sizeAdjust: 1,
            tooltipOffset: 9
        },
        grid: {
            background: '#fff',
            drawBorder: false,
            shadow: false,
            gridLineColor: '#666666',
            gridLineWidth: 1
        },
        legend: {
            show: true,
            placement: 'outside'
        },
        seriesDefaults: {
			 shadow: false, // show shadow or not.
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            },
			markerOptions: {
            show: true,             // wether to show data point markers.
            style: 'filledCircle',  // circle, diamond, square, filledCircle.
                                    // filledDiamond or filledSquare.
            lineWidth: 2,       // width of the stroke drawing the marker.
            size: 10,            // size (diameter, edge length, etc.) of the marker.
           // color: '#ff8a00',    // color of marker, set to color of line by default.
            shadow: false,       // wether to draw shadow on marker or not.
            shadowAngle: 45,    // angle of the shadow.  Clockwise from x axis.
            shadowOffset: 1,    // offset from the line of the shadow,
            shadowDepth: 3,     // Number of strokes to make when drawing shadow.  Each stroke
                                // offset by shadowOffset from the last.
            shadowAlpha: 0.07   // Opacity of the shadow
        }
        },
        series: [
            {
                label: 'Total Rupiah Transaksi',
                markerOptions: {color:'#ff8a00'}
            },
            {
                label: 'Target',
                markerOptions: {color:'#00C'}
            }
        ],
        axesDefaults: {
            rendererOptions: {
                baselineWidth: 1.5,
                baselineColor: '#444444',
                drawBaseline: false
            }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                tickOptions: {
                    formatString: "%b %e",
                    angle: -30,
                    textColor: '#000'
                },
                min: "<?=$first_total_service?>",
                max: "<?=$key?>",
                tickInterval: "2 days",
                drawMajorGridlines: false
            },
            yaxis: {
                renderer: $.jqplot.LogAxisRenderer,
                pad: 0,
                rendererOptions: {
                    minorTicks: 1
                },
                tickOptions: {
                    formatString: "%'d",
                    showMark: false
                }
            }
        }
    });
    
    $("#chart_total_service").show();
    $("#total_service_title").click(function(){
      $("#chart_total_service").fadeToggle();
    });
    
    $("#chart_total_belanja").hide();
    $("#total_belanja_title").click(function(){
      $("#chart_total_belanja").fadeToggle();
    });
    
    $("#chart_total_transaksi").hide();
    $("#total_transaksi_title").click(function(){
      $("#chart_total_transaksi").fadeToggle();
    });
    
    $("#chart_total_rupiah_service").hide();
    $("#total_rupiah_service_title").click(function(){
      $("#chart_total_rupiah_service").fadeToggle();
    });
    
    $("#chart_total_rupiah_belanja").hide();
    $("#total_rupiah_belanja_title").click(function(){
      $("#chart_total_rupiah_belanja").fadeToggle();
    });
    
    $("#chart_total_rupiah_transaksi").hide();
    $("#total_rupiah_transaksi_title").click(function(){
      $("#chart_total_rupiah_transaksi").fadeToggle();
    });
});

</script>